<template>
  <a-table
    rowKey="id"
    size="middle"
    bordered
    :loading="loading"
    :columns="columns"
    :dataSource="tableDataWithTotal"
    :pagination="false"
  >
    <template slot="htmlSlot" slot-scope="text">
      <div v-html="text"></div>
    </template>

    <template slot="imgSlot" slot-scope="text,record">
      <div style="font-size: 12px;font-style: italic;">
        <span v-if="!text">无图片</span>
        <img v-else :src="getImgView(text)" :preview="record.id" alt="" style="max-width:80px;height:25px;"/>
      </div>
    </template>

    <template slot="fileSlot" slot-scope="text">
      <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
      <a-button
        v-else
        ghost
        type="primary"
        icon="download"
        size="small"
        @click="downloadFile(text)"
      >
        <span>下载</span>
      </a-button>
    </template>
  </a-table>
</template>

<script>
import { getAction } from '@api/manage'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'

export default {
  name: 'CwSyrygzbSubTable',
  mixins: [JeecgListMixin],
  props: {
    record: {
      type: Object,
      default: null,
    }
  },
  data() {
    return {
      description: '赡养人员工资表内嵌列表',
      disableMixinCreated: true,
      loading: false,
      dataSource: [],
      // 所有需要计算合计的金额字段（完整19个）
      totalMoneyFields: [
        'postWage', 'xjgz', 'livingAllowance', 'gzxjt', 'sanitationFee',
        'hmpt', 'fb', 'jcjxj', 'salary', 'ylbx',
        'ylbxa', 'syj', 'zynj', 'zfgjj', 'gs',
        'ykhj', 'payoff', 'heatingFee'
      ],
      columns: [
        {
          title: '财政/非财政',
          align: 'center',
          dataIndex: 'czFcz'
        },
        {
          title: '姓名',
          align: 'center',
          dataIndex: 'name',
        },
        {
          title: '单位',
          align: 'center',
          dataIndex: 'unit_dictText'
        },
        {
          title: '职务',
          align: 'center',
          dataIndex: 'duty',
        },
        {
          title: '岗位工资',
          align: 'center',
          dataIndex: 'postWage',
          customRender: (text) => this.formatMoney(text)
        },
        {
          title: '薪级工资',
          align: 'center',
          dataIndex: 'xjgz',
          customRender: (text) => this.formatMoney(text)
        },
        {
          title: '生活性补贴',
          align: 'center',
          dataIndex: 'livingAllowance',
          customRender: (text) => this.formatMoney(text)
        },
        {
          title: '工作性津贴',
          align: 'center',
          dataIndex: 'gzxjt',
          customRender: (text) => this.formatMoney(text)
        },
        {
          title: '卫生费',
          align: 'center',
          dataIndex: 'sanitationFee',
          customRender: (text) => this.formatMoney(text)
        },
        {
          title: '回民补贴',
          align: 'center',
          dataIndex: 'hmpt',
          customRender: (text) => this.formatMoney(text)
        },
        {
          title: '13%房补',
          align: 'center',
          dataIndex: 'fb',
          customRender: (text) => this.formatMoney(text)
        },
        {
          title: '基础绩效奖',
          align: 'center',
          dataIndex: 'jcjxj',
          customRender: (text) => this.formatMoney(text)
        },
        {
          title: '应发工资',
          align: 'center',
          dataIndex: 'salary',
          customRender: (text) => this.formatMoney(text)
        },
        {
          title: '养老保险',
          align: 'center',
          dataIndex: 'ylbx',
          customRender: (text) => this.formatMoney(text)
        },
        {
          title: '医疗保险',
          align: 'center',
          dataIndex: 'ylbxa',
          customRender: (text) => this.formatMoney(text)
        },
        {
          title: '失业金',
          align: 'center',
          dataIndex: 'syj',
          customRender: (text) => this.formatMoney(text)
        },
        {
          title: '职业年金',
          align: 'center',
          dataIndex: 'zynj',
          customRender: (text) => this.formatMoney(text)
        },
        {
          title: '住房公积金',
          align: 'center',
          dataIndex: 'zfgjj',
          customRender: (text) => this.formatMoney(text)
        },
        {
          title: '个税',
          align: 'center',
          dataIndex: 'gs',
          customRender: (text) => this.formatMoney(text)
        },
        {
          title: '应扣合计',
          align: 'center',
          dataIndex: 'ykhj',
          customRender: (text) => this.formatMoney(text)
        },
        {
          title: '实发工资',
          align: 'center',
          dataIndex: 'payoff',
          customRender: (text) => this.formatMoney(text)
        },
        {
          title: '取暖费',
          align: 'center',
          dataIndex: 'heatingFee',
          customRender: (text) => this.formatMoney(text)
        },
      ],
      url: {
        listByMainId: '/cw/cwSyrygzbTj/queryCwSyrygzbByMainId',
      },
    }
  },
  computed: {
    tableDataWithTotal() {
      if (!this.dataSource || this.dataSource.length === 0) return []

      const newData = JSON.parse(JSON.stringify(this.dataSource))
      // 计算所有金额字段的合计
      const allTotals = this.calcAllMoneyTotals()

      // 构建完整合计行
      const totalRow = {
        id: 'total_' + new Date().getTime(),
        czFcz: '',
        name: '合计',
        unit_dictText: '',
        duty: '',
        // 填充所有金额字段的合计值
        postWage: allTotals.postWage,
        xjgz: allTotals.xjgz,
        livingAllowance: allTotals.livingAllowance,
        gzxjt: allTotals.gzxjt,
        sanitationFee: allTotals.sanitationFee,
        hmpt: allTotals.hmpt,
        fb: allTotals.fb,
        jcjxj: allTotals.jcjxj,
        salary: allTotals.salary,
        ylbx: allTotals.ylbx,
        ylbxa: allTotals.ylbxa,
        syj: allTotals.syj,
        zynj: allTotals.zynj,
        zfgjj: allTotals.zfgjj,
        gs: allTotals.gs,
        ykhj: allTotals.ykhj,
        payoff: allTotals.payoff,
        heatingFee: allTotals.heatingFee
      }

      newData.push(totalRow)
      return newData
    }
  },
  watch: {
    record: {
      immediate: true,
      handler() {
        if (this.record) {
          this.loadData(this.record)
        }
      }
    }
  },
  methods: {
    loadData(record) {
      this.loading = true
      this.dataSource = []
      getAction(this.url.listByMainId, { id: record.id })
        .then((res) => {
          if (res.success) {
            this.dataSource = res.result.records || []
          }
        })
        .finally(() => {
          this.loading = false
        })
    },

    // 金额格式化通用方法
    formatMoney(text) {
      const num = Number(text)
      return isNaN(num) ? '0.00' : num.toFixed(2)
    },

    // 计算所有金额字段的合计
    calcAllMoneyTotals() {
      // 初始化所有合计字段为0
      const totals = this.totalMoneyFields.reduce((obj, field) => {
        obj[field] = 0
        return obj
      }, {})

      // 遍历数据累加每个字段
      this.dataSource.forEach(item => {
        this.totalMoneyFields.forEach(field => {
          const val = Number(item[field])
          totals[field] += isNaN(val) ? 0 : val
        })
      })

      // 格式化所有合计结果
      this.totalMoneyFields.forEach(field => {
        totals[field] = totals[field].toFixed(2)
      })

      return totals
    },

    downloadFile(text) {
    },
    getImgView(text) {
      return text
    }
  },
}
</script>

<style scoped>
/* 合计行样式强化，区分度更高 */
::v-deep .ant-table-tbody tr:last-child {
  background-color: #e8f4f8 !important;
}

::v-deep .ant-table-tbody tr:last-child td {
  font-weight: 600 !important;
  border-top: 2px solid #1890ff !important;
  color: #096dd9 !important;
  text-align: center !important;
}

/* 表格列宽优化，避免文字挤压 */
::v-deep .ant-table-column {
  white-space: nowrap !important;
}

::v-deep .ant-table-content {
  overflow-x: auto !important;
}
</style>